import React from "react";
import "../App.css";
import RouterView from "../Router/RouterView";
import { Layout, Menu } from "antd";
import {
  UserOutlined,
  LaptopOutlined,
  NotificationOutlined,
} from "@ant-design/icons";

function App(props) {
  const { routes } = props;
  const { SubMenu } = Menu;
  const { Header, Content, Sider } = Layout;
  const list = [
    {
      path: "/home/hot",
      name: "热点",
    },
    {
      path: "/home/sleep",
      name: "睡眠",
    },
    {
      path: "/home/man",
      name: "男性",
    },
  ];

  //科学管理
  const goTo = (item) => {
    props.history.push(item.path);
  };
  //药品管理
  const gohome = () => {
    props.history.push("/home/home");
  };
  //人员管理
  //首页管理
  const gostaff = () => {
    props.history.push("/home/staff");
  };

  return (
    <div className="app">
      <Layout>
        <Header className="header">
          <font color="#ffff">美洽智慧医疗后台管理系统</font>
        </Header>

        <Layout
          className="site-layout-background"
          style={{ padding: "24px 0" }}
        >
          <Sider className="site-layout-background" width={200}>
            <Menu
              mode="inline"
              // defaultSelectedKeys={['1']}
              // defaultOpenKeys={['sub1']}
              style={{ height: "100%" }}
            >
              <SubMenu key="sub1" icon={<UserOutlined />} title="科普管理">
                {list.length &&
                  list.map((item, index) => {
                    return (
                      <Menu.Item
                        key={index}
                        onClick={() => {
                          goTo(item);
                        }}
                      >
                        {item.name}
                      </Menu.Item>
                    );
                  })}
              </SubMenu>

              <Menu.Item
                icon={<LaptopOutlined />}
                key="sub2"
                onClick={() => {
                  gohome();
                }}
              >
                药品管理
              </Menu.Item>
            </Menu>
          </Sider>
          <Content style={{ padding: "0 24px", minHeight: 280 }}>
            {" "}
            <RouterView routes={routes}></RouterView>
          </Content>
        </Layout>
      </Layout>
    </div>
  );
}

export default App;
